<html>
<head>
    <title>jQuery Undo Demo</title>
<!-- these are optional; they just make the message pretty. -->
    <link href="../place/jquery.place.css" rel="stylesheet">
    <link href="jquery.undo.css" rel="stylesheet">
    <style>
body { font-size: 11pt; }
.top { font-size: 1.2em; }
.box {
    margin: 0px 5px;
    padding: 5px;
    border: 1px dotted black;
}
.main { height: 3em }
.txt-properties {
    display: none;
}
    </style>
    <script type="text/javascript" src="../../jquery.1.4.2.js"></script>
    <script type="text/javascript" src="../measure/jquery.measure.js"></script>
    <script type="text/javascript" src="../place/jquery.place.js"></script>
    <script type="text/javascript" src="../txt/jquery.txt.js"></script>
    <script type="text/javascript" src="jquery.undo.js"></script>
    <script type="text/javascript" src="../../trunk/jquery.values.js"></script>
    <script type="text/javascript" src="../log/log.js"></script>
    <script type="text/javascript">
    $(function() {
        $('#do').click(function() {
            var button = $(this).hide();
            $.undo({
                text: 'clicked',
                finish: function() {
                    button.detach();
                },
                revert: function() {
                    button.show();
                }
            });
            
        });
    });
    </script>
    <script type="text/javascript" src="../txt/jquery.txt.js"></script>
</head>
<body>
<div class="top box">
Click the button.
</div>
<br clear="all">
<div class="box main">
    <button id="do">Click Me</button>
</div>
<div class="txt-properties">
    clicked = You have clicked the button.
</div>
</body>
</html>